//====================================================
//
//		select
//
//====================================================

//默认下拉框
.@{prefix}select {
	display: inline-block;
	position: relative;
	z-index: @zindex-select;
	height: @height-select;
	width: 120px;
	vertical-align: middle;
	cursor: @cursor-pointer;

	.prefix-transition();

	.@{prefix}select-box {
		position: relative;
		z-index: @zindex-selectbox;
		height: @height-select;
		width: 100%;
		padding: 0px @padding-select-r 0px @padding-select-l;
		margin: 0px;
		border: 1px solid @color-gray-lighter;
		background-color: @color-white-light;
		font-size: @fontsize-select-text;	//unit( @fontsize-select-text, em );
		overflow: hidden;

		.prefix-border-radius(@radius-select);
		.prefix-transition();

		&:after {
			display: block;
			position: absolute;
			z-index: @zindex-selectbox-after;
			top: 0px;
			right: 0px;
			width: 24px;
			height: 100%;
			line-height: @height-select - 2;
			color: @color-gray-darker;
			text-align: center;

			.comm-iconfont( @icon-select-right, 14px );
		}

		.@{prefix}select-text {
			width: 100%;
			height: @height-select;
			line-height: @lineheight-select;
			padding: 0px;
			margin: 0px;
			border: 0px;
			border-right: 15px solid transparent;
			font-size: @fontsize-select-text;	//unit( @fontsize-select-text, em );
			background-color: transparent;
			vertical-align: middle;
			cursor: pointer;

			.comm-textoverflow();

			&:focus {
				outline: none;
			}
			&.readonly,
			&[readonly] {
				.prefix-selecttext(none);
			}
		}
	}

	.@{prefix}select-list {
		display: none;
		width: 100%;
		max-height: @height-select-list;
		position: absolute;
		z-index: @zindex-selectlist;
		left: 0px;
		margin: 0px;
		margin-top: -1px;
		padding: 0px;
		border: 1px solid @color-white-darker;
		background-color: @color-white-light;
		font-size: @fontsize-select-list;	//unit( @fontsize-select-list, em );
		overflow-x: hidden;
		overflow-y: auto;

		.prefix-border-bottom-radius(@radius-select-list);
		.prefix-transition();

		.@{prefix}select-item {
			display: block;
			height: @height-select-item;
			line-height: @height-select-item;
			padding-left: @padding-select-l;
			padding-right: @padding-select-r;
			list-style: none;
			color: @color-black-light;
			background-color: @color-white-light;
			overflow: hidden;

			.comm-textoverflow();
			.prefix-transition(all linear .08s);
			.prefix-selecttext(none);

			&:hover {
				color: @color-black-dark;
				background-color: @color-white-normal;
			}
			&:active,
			&.active {
				color: @color-black-normal;
				background-color: @color-white-dark;
				.prefix-box-shadow(inset 0 1px 2px rgba(0, 0, 0, .08));
			}
			&.selected {
				color: @color-select-item-selected;
				background-color: @bgcolor-select-item-selected;
				cursor: @cursor-def;
			}
			&.disabled {
				&,
				&:hover,
				&:active,
				&.active,
				&.selected {
					color: @color-gray-normal;
					cursor: @cursor-no;
					background-color: @color-white-light;
					.prefix-box-shadow(none);
				}
			}
		}
		.@{prefix}split {
			height: 0px;
			border-top: 1px solid @color-gray-lighter;
			margin: @height-select-split/2 0px;
			font-size: 0;
		}
	}
	&:active,
	&.active {
		z-index: @zindex-select-hover;

		.@{prefix}select-box,
		.@{prefix}select-list {
			border-color: @color-gray-light;
		}
	}
	&:hover,
	&.hover {
		z-index: @zindex-select-hover;

		.@{prefix}select-box {
			.prefix-box-shadow(0 4px 10px rgba(0, 0, 0, .08));
		}
	}
	&:active,
	&.active {
		.@{prefix}select-box {
			background-color: @color-white-light;
			border-bottom-color: @color-gray-lighter;

			.prefix-border-bottom-radius(0);
			.prefix-box-shadow(inset 0 1px 3px rgba(0, 0, 0, .08));

			&:after {
				content: @icon-select-down;
			}
		}
		.@{prefix}select-list {
			display: block;

			.prefix-box-shadow(0 4px 10px rgba(0, 0, 0, .08));
		}
	}
	&.top {
		.@{prefix}select-list {
			left: 0;
			bottom: 0;
			margin-bottom: 35px;
			border-bottom: 0;

			.prefix-border-top-radius(@radius-select-list);
			.prefix-border-bottom-radius(0);
		}
	}
	&.top:active,
	&.top.active {
		.@{prefix}select-box {
			border-top-color: @color-gray-lighter;
			border-bottom-color: @color-gray-light;

			.prefix-border-top-radius(0);
			.prefix-border-bottom-radius(@radius-select);

			&:after {
				content: @icon-select-up;
			}
		}
	}


}

.@{prefix}select-full {
	display: block;
	width: 100%;
}

.@{prefix}select-center {
	.@{prefix}select-text {
		text-align: center;
	}
}

.@{prefix}select-small {
	height: @height-select-small;
	font-size: @fontsize-select-small-text;	//unit( @fontsize-select-small-text, em );

	&.top {
		.@{prefix}select-list {
			margin-bottom: @height-select-small;
		}
	}
	.@{prefix}select-box {
		height: @height-select-small;
		&:after {
			line-height: @height-select-small - 2;
		}
		.@{prefix}select-text {
			height: @height-select-small;
			line-height: @lineheight-select-small;
			font-size: @fontsize-select-small-text;	//unit( @fontsize-select-small-text, em );
		}
	}

	.@{prefix}select-list {
		font-size: @fontsize-select-small-list;	//unit( @fontsize-select-small-list, em );

		.@{prefix}select-item {
			height: @height-select-small-item;
			line-height: @height-select-small-item;
		}
	}
}
.@{prefix}select-large {
	height: @height-select-large;
	font-size: @fontsize-select-large-text;	//unit( @fontsize-select-small-text, em );

	&.top {
		.@{prefix}select-list {
			margin-bottom: @height-select-large;
		}
	}
	.@{prefix}select-box {
		height: @height-select-large;
		&:after {
			line-height: @height-select-large - 2;
		}
		.@{prefix}select-text {
			height: @height-select-large;
			line-height: @lineheight-select-large;
			font-size: @fontsize-select-large-text;	//unit( @fontsize-select-large-text, em );
		}
	}
	.@{prefix}select-list {
		font-size: @fontsize-select-large-list;	//unit( @fontsize-select-large-list, em );

		.@{prefix}select-item {
			height: @height-select-large-item;
			line-height: @height-select-large-item;
		}
	}
}



